<template>
    <div class="storeInfo">
        <div class="head">    
            <p class="headTxt" style="color:red;font-weight:900">{{params.title}} {{params.date}}</p>            
            <el-form class="headForm">
                <el-button type="danger" @click="back" >返回</el-button> 
                <el-button type="danger" @click="exportInfo" >导出明细</el-button> 
            </el-form>  
        </div> 
        <!-- table -->
        <div class="tabContainer">
            <el-table :data="tableData" stripe style="width: 100%;text-align:center">
                <!-- 商品ID	商品名称	采购数量	采购价格	合计	采购批次 -->
                <el-table-column prop="item_id" label="商品ID" fixed></el-table-column>
                <el-table-column prop="item_name" label="商品名称"> </el-table-column>
                <el-table-column prop="purchase_num" label="采购数量" width="200"></el-table-column>
                <el-table-column prop="provide_price" label="采购价格"></el-table-column>
                <el-table-column prop="total_price" label="合计"></el-table-column>               
                <el-table-column prop="batch" label="采购批次">
                    <template slot-scope="scope">
                        <p v-for="itemb in scope.row.batch" :key="itemb">{{itemb}}</p>
                    </template>
                </el-table-column>

            </el-table>                       
        </div>
        <!-- 分页部分 -->
        <!-- 分页部分 -->
        <!-- <el-pagination
            background
            layout="total, prev, pager, next, jumper"
            @current-change="changePage"
            :page-size="size"
            :current-page.sync="pageNum"
            :hide-on-single-page=true
            :total="total">{{total}}
        </el-pagination> -->
    </div>
  
</template>

<style>
.setWidth{width:140px !important}
</style>
<script>
import Vue from 'vue';
import { abc } from "../../../../js/abc.js";
import {potUrl} from '../../../../js/config_url.js'; 
export default {
  name: 'HelloWorld',
  data () {
    return {
        tableData:[],
        total:50,
        size:20,
        pageNum:1,
        params:{
            page:1,
            size:20,
            date:'',
            store_id:abc.getSession('store_id')
        }
    }
  },
   mounted(){
      let that = this;
        that.params.date = that.$route.params.month;
        that.params.settle_id = that.$route.params.settle_id
        that.params.title = that.$route.params.title;
        that.getList()
  },
  methods:{

      back(){
          this.$router.push('/result')
      },
    //   changePage(val){
    //     var that = this;
    //     that.pageNum = val;
    //     that.params.page = val;
    //     that.getList()
    // },
    exportInfo(){
        //window.location.href = hostUrl + '/operate/psettle/export' + publicData + '&settle_id=' + methods.getParams().settle_id;
        let iData = abc.getSession('params') + '&settle_id=' + this.params.settle_id;
        window.location.href = abc.hostUrl + potUrl.psettleexport + iData;
    },
    getList(){
        let that = this;
        abc.get(that,potUrl.psettledetail,{settle_id:that.params.settle_id},(res)=>{
            that.tableData=res.data;
            that.total = res.data.length;
        })//列表
    }
  }
}
</script>
